<template>
  <ul class="ads">
    <li
      v-for="(ad, index) in ads"
      :key="index"
    >
      <a :href="ad.url">
        <img :src="ad.img" alt="图片加载失败" />
      </a>
    </li>
  </ul>
</template>

<script>
export default {
  name: 'HomeAd',
  props: {
    ads: {
      type: Array,
      default() {
        return [];
      }
    }
  }
};
</script>

<style lang="less" scoped>
  .ads {
    li {
      height: 50px;
      margin-bottom: 10px;
      border: 1px solid #ddd;
      background-color: #fff;
      img {
        width: 100%;
        height: 100%;
      }
    }
  }
</style>
